@import "app/variable";
@import "app/mixins";

fieldset {
  padding: 0;
  margin: 0;
  border: 0;
  min-width: 0;
}

legend {
  display: block;
  width: 100%;
  padding: 0;
  margin-bottom: $line-height-computed;
  font-size: ($font-size-base * 1.5);
  line-height: inherit;
  color: $legend-color;
  border: 0;
  border-bottom: 1px solid $legend-border-color;
}

label {
  display: inline-block;
  max-width: 100%; // Force IE8 to wrap long content (see https://github.com/twbs/bootstrap/issues/13141)
  margin-bottom: 5px;
  font-weight: bold;
}


input[type="search"] {
    box-sizing:border-box;
  // @include box-sizing(border-box);
}

input[type="radio"],
input[type="checkbox"] {
  margin: 4px 0 0;
  margin-top: 1px \9; // IE8-9
  line-height: normal;
}

input[type="file"] {
  display: block;
}

input[type="range"] {
  display: block;
  width: 100%;
}

select[multiple],
select[size] {
  height: auto;
}

input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
  @include tab-focus;
}

output {
  display: block;
  padding-top: ($padding-base-vertical + 1);
  font-size: $font-size-base;
  line-height: $line-height-base;
  color: $input-color;
}






input[type="text"],
input[type="number"],
input[type="password"]{

    height: $input-height-base; // Make inputs at least the height of their button counterpart (base line-height + padding + border)
    padding: $padding-base-vertical $padding-base-horizontal;
    font-size: $font-size-base;
    line-height: $line-height-base;
    color: $input-color;
    box-sizing: border-box;

    @include placeholder;

    &::-ms-expand {
        border: 0;
        background-color: transparent;
    }

    &[disabled],
    &[readonly],
    fieldset[disabled] & {
        background-color: $input-bg-disabled;
        opacity: 1;
    }

    &[disabled],
    fieldset[disabled] & {
        cursor: $cursor-disabled;
    }
}

.form-control{
    // display: inline-block;
    // display: block;
    // width: 100%;
    background-color: $input-bg;
    background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214
    border: 1px solid $input-border;
    border-radius: $input-border-radius; // Note: This has no effect on <select>s in some browsers, due to the limited stylability of <select>s in CSS.
    box-shadow:inset 0 1px 1px rgba(0,0,0,.075);
    transition:border-color ease-in-out .15s, box-shadow ease-in-out .15s;

    $color-rgba: rgba(red($input-border-focus), green($input-border-focus), blue($input-border-focus), .6);
    &:focus {
        border-color: $input-border-focus;
        outline: 0;
        box-shadow:inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px $color-rgba;
    }
}
